<style lang="sass" scoped>
    .container{
        padding:100px 20px;
    }
    .group{
        height:80px;
        border-bottom:1px solid #ccc;
        align-items:center;
        margin-bottom:30px;
        justify-content:space-between;
        padding:0 10px;
        .labels{
            width:80px;
            font-size:24px;
        }    
        input{
            background:#fff;
            border:0;
            flex:1;
        }
        .msg{
            width:45%;
            font-size:24px;
        }
        .msg2{
            width:45%;
            text-align:right;
            font-size:24px;
        }
    }
    .tips{
        margin-top:50px;
        div{
            text-align:center;
            font-size:24px;
        }
    }
    .apply{
        width:200px;
        height:80px;
        line-height:80px;
        text-align:center;
        color:#fff;
        font-size:36px;
        border-radius:10px;
        margin:200px auto 0;
        background:#ccc;
        &.can{
            background:#ff6e6e;
        }
    }
</style>
<template>
    <div class="container">
        <div class="group flex">
            <div class="labels">提现：</div>
            <input type="text" v-model.trim="withdrawFee" placeholder="请输入金额">
        </div>
        <div class="group flex">
            <div class="msg">总提现金额：{{info.withdrawalFee}}元</div>
            <div class="msg2">剩余可提现：{{info.balance}}元</div>
        </div>
        <div class="tips">
            <div>单次提现金额不得低于1000元整</div>
            <div>每个月仅可提现一次</div>
        </div>
        <div v-if="can" @click="withdraw()" class="apply can">申请</div>
        <div v-else class="apply">申请</div>
    </div>
</template>
<script>
    export default {
        components: {
        },
        data() {
            return {
                info:{},
                withdrawFee:'',
            };
        },
        watch:{
        },
        computed:{
            can(){
                if(this.info.isCanWithdraw===1&&this.withdrawFee>=1000&&this.info.balance>=1000){
                    return true;
                }
            }
        },
        created(){
            this.getInfo();
        },
        mounted() {
            this.$nextTick(() => {
                 
            });
        },
        methods: {
            getInfo(){
                util.ajax({
                    url:config.baseApi + 'bookMall-dms/api/index/getIndexData',
                    success:(data=>{
                        this.info = data.data;
                    })
                })
            },
            withdraw(){
                util.ajax({
                   url:config.baseApi + 'bookMall-dms/api/withdraw/withdraw',
                   data:{
                       withdrawFee:this.withdrawFee
                    },
                    success:(data=>{
                        router.replace({name:'apply_success'})
                    })
                })
            }
        },
        
    };
</script>